11 Gorgeous Simple Dropdown Menu Collection For Creative Designers

1. Light Blue Menu

featured image

This is a simple CSS dropdown menu created without images, only using css/html/font icons.Dropdown

More Details

2. Apycom jQuery Menus

Apycom jQuery Menus

Full cross-browser compatibility, Fully accessible even when javascript is turned off, as a pure css menu, Search engines optimized, Clear unordered list (LI and UL HTML tags) structure, Easy to setup and update, Fantastic animation and transition effects, Multiple pre-desinded color schemes, Completely customizable styling with CSS, Powered by jQuery,

Extremely small - 3kb uncompressed

More Details

3. navIgo - Multipurpose Responsive Navigation Plugin

featured image

In addition, any plugin parameter can be overwritten directly from each menu <ul> data-attributes.Multiple menus on one page: and you can control almost anything for each menu, easy!

Optional “stayopen” class: useful for dropdown contained forms, videos… It avoids dropdown disappearing on mouseout

Smart options management: each plugin parameter can be overwritten by an equivalent data attribute inside the <ul> tag of each menu, in this way you can set overall rules for all navbars on the website, but you can customize each menu simply adding attributes in the markup!

Super simple markup: if you take a look of the ul tags markup you will see a very easy element structure!

Alpha or slide jQuery FX for menu dropdown JavaScript code levels

Useful color inheritance system: you can set color class for a main level button and enable or disable style inheritance, to transmit color to its submenus, and even to the dropdown bg.Special responsive button mouseover mode: if button has a dropdown, each following button disappear on mouseover, only dropdown will be shown.Responsive toggle-menu button: you can enable or disable a menu wrapper with show/hide automatic button. Added tab mode (menu can be used as a tabbed interface)

Added “stayopen” mode (useful for dropdown contained forms, videos… It avoids dropdown disappear on mouseout)

More Details

4. Sky Mega Menu

featured image

Sky Mega Menu is a clean, responsive solution for creation beautiful site navigations.If you like Sky Mega Menu, please don’t forget to rate!

Useful examplesYou can use these examples as a base for creation your own navigations simple and fast.I was having troubles with the menu due to my stupidness and Voky sat with me for almost the entire night fixing my problem.

More Details

5. MelonHTML5 - Royal Tab

featured image

It can be easily integrated into any websites with simple & clean HTML markup.Multiple LayoutsRoy Tab gives you various options to position the CSS tab menu (top, bottom, left, right).Dropdown Shortcut

A unique dropdown shortcut menu is generated automatically which gives you easy access to each tab.

More Details

6. XMenu - Animated Horizontal Dropdown Menu

featured image

This is a very simple and elegant menu created purely in css3.

More Details

7. Pure CSS3 Dropdown MegaMenu

featured image

Contains dropdown simple forms

More Details

8. Simple Responsive Menu

featured image

“Simple Responsive Menu” is a navigation component based in pure CSS. This menu uses gradient colors and CSS effects to provide a beautiful design. It is a responsive menu CSS component and can be used in various website types.

More Details

9. Slicnot - Clean CSS Menu with Sliced Notification

featured image

Hello everybody! Slicnot is a small CSS toolkit that allows you to create anything from just a simple plain button to a complex drop-down navigation menu bar with very less amount of effort.• Separated Menu Button

Vertical Dropdown Menu

More Details

10. TAKO Vertical Responsive Dropdown Menu

featured image

This it’s a menu with 3 columns of pages with a very good design and color combinations and its compatible with mobile devices! Its very efficient for people who want a simple responsive menu with modern design.- We added the Mega-Menu design with the posibility to add forms, images and video in the dropdown!

- Also we added 360+ vector icons to put them in your menu items!

Vertical Dropdown

Easy to add new menu items

Mega-Menu Content:

Image Gallery’s or simple images!

- Mega-menu Content (complete forms, images, video and more!)

More Details

11. Beth - Mobile-First Responsive Menu

featured image

It follows the popular trend of “flat design”, having a simple but usable and easy to integrate design. On mobile devices, the fluid horizontal menu turns into a vertical dropdown menu CSS which can be toggled with a click/single tap. Note: the menu can handle only one-level submenus.Fixed the bug which made the responsive menu icon not clickable

More Details

12. Shifty Nav - a Fully Responsive JS CSS3 Mega Menu

featured image

Shifty Nav is a fully responsive CSS3 mega menu. It was created using LESSCSS so modification is incredibly simple. To change the color of the entire menu requires a simple changing of a few pre-defined variables, so there’s not extensive digging through the code!

This menu supports whatever kind of content you throw at it, and includes a full tutorial on how to build the markup for your own menu if you don’t want to modify the pre-existing file.Completely customizable menu layout

More Details